<template>
  <view class="page bg-white">
    <view class="main">
      <TeacherEventItem :type="1" :eventList="eventList" />
    </view>
  </view>
</template>
<script setup>
import { ref } from 'vue';
import TeacherEventItem from '@/components/TeacherEventItem/index.vue';
const eventList = ref([
  {
    title: '作业',
    type: 1,
    content: '张三作业条已提交，请及时上传张三作业',
    time: '2025-09-20 10:00'
  },
  {
    title: '报告',
    type: 2,
    content: '张三报告已提交，请及时查看张三报告',
    time: '2025-09-20 10:00'
  }
])
</script>
<style scoped lang="scss">
.event-item {
  display: flex;
  justify-content: space-between;
  border-bottom: solid 1px #eee;
  gap: 30rpx;
  padding: 30rpx 0;

  .tag {
    background: #EBF3FF;
    color: #0060E6;
    font-size: 24rpx;
    padding: 2rpx 10rpx;
    border-radius: 10rpx;
    height: 32rpx;


    &.tag-job {
      background: #EBF3FF;
      color: #0060E6;
    }

    &.tag-report {
      background: #FFF1D9;
      color: #FFA40C;
    }
  }

}

.btn-handle {
  background: #EBF3FF;
  color: #0060E6;
  font-size: 28rpx;
  padding: 10rpx 20rpx;
  border-radius: 50rpx;

  &.btn-handle-disabled {
    background: #EEEEEE !important;
    color: #999999 !important
  }
}
</style>